
  // react 书写 样式 

  // 1. 基于class  但是 react 必须 className 代替class
  // 2. 基于内联样式 style  style = {obj}   遵循 驼峰命名 
  // style = {backgroundColor:"red",fontSize:20}
  // lineHeight:'20px'    必须带单位 
  // 3. 全局变量  外部样式   原型链挂载 
import {allcss} from "~/common"
  const mystyle = {
     one:{
        display:"flex",
        justifyContent:"center",
        alignItems:"center"
     },
     two:{
       fontSize:30,
       color:"red",
       background:"yellow",
       borderRadius:20,
       textAlign:'center'
     }
  }
  export class CptCss extends Component{
    render(){
      return (
        <div className="cssbox" style={allcss.golbal}>
          <h2 style={ allcss.head   }   > React 组件书写 CSS</h2>
          <h2 style={ mystyle.two } > 基于class  但是 react 必须 className 代替class</h2>
          <h3 style={ {color:'green',fontSize:60, border:'1px solid pink',backgroundColor:"#123" } } > 基于内联样式 style  </h3>
        </div>
      )
    }
  }